<template>
  <div class="wrap">
    <el-dialog title="导入学生" :visible.sync="importStudentVisible" width="60%">
      <div style="margin-bottom: 20px">
        <el-input style="width: 250px" placeholder="请输入学生姓名" v-model="studentData.studentName" size="small"></el-input>
        <el-select v-model="studentData.grade" placeholder="请选择" style="width: 250px;margin-left: 20px">
          <el-option v-for="(item, index) in classType" :key="index" :label="item.dictLabel" :value="item.dictCode + ''"
            size="small">
          </el-option>
        </el-select>
        <a-button type="primary" style="margin-left: 20px" @click="searchStudent"> 搜索</a-button>
      </div>

      <!--      </el-col>-->
      <!--          :rowSelection={teacherRowSelection}-->
      <a-table :row-selection="{ selectedRowKeys: studentSelectedRowKeys, onChange: onStudentSelectChange }"
        :columns="studentColumns" :pagination="false" :data-source="studentListInfo" bordered
        style="max-height: 800px;min-height: 300px;overflow-y:scroll" :rowKey="(record, index) => {
            return index;
          }
          ">
      </a-table>
      <a-pagination style="margin: 10px 0" v-model="studentData.page" :page-size-options="pageSizeOptions"
        :total="studentData.total" show-size-changer :page-size="studentData.size"
        @showSizeChange="onShowStudentSizeChange" @change="studentPageChange">
      </a-pagination>



      <el-button @click="importStudentVisible = false">取 消</el-button>
      <el-button type="primary" @click="importStudentData">确 定</el-button>

    </el-dialog>
    <el-dialog title="导入教师" :visible.sync="importTeacherVisible" width="60%">
      <!--      <el-col :span="24" style="min-width: 100vw">-->
      <div style="margin-bottom: 10px;">
        <el-input style="width: 250px;margin-right: 10px;" placeholder="请输入教职工姓名" v-model="teacherData.teacherName"
          size="small"></el-input>
        <a-button type="primary" @click="searchTeacher"> 搜索</a-button>
      </div>
      <!--      </el-col>-->
      <!--          :rowSelection={teacherRowSelection}-->
      <a-table :row-selection="{ selectedRowKeys: teacherSelectedRowKeys, onChange: onTeacherSelectChange }"
        :columns="teacherColumns" :pagination="false" :data-source="teacherListInfo" bordered
        style="max-height: 800px;min-height: 300px;overflow-y:scroll" :rowKey="(record, index) => { return index; }">
      </a-table>
      <a-pagination style="margin: 10px 0" v-model="teacherData.page" :page-size-options="pageSizeOptions"
        :total="teacherData.total" show-size-changer :page-size="teacherData.size"
        @showSizeChange="onShowTeacherSizeChange" @change="teacherPageChange"></a-pagination>
      <span slot="footer" class="dialog-footer">
        <el-button @click="importTeacherVisible = false">取 消</el-button>
        <el-button type="primary" @click="importTeacherData">确 定</el-button>
      </span>
    </el-dialog>
    <a-row style="background: #fff; background: #fff; border-radius: 6px">
      <a-col :span="6" style=" padding: 10px">
        <a-input-search style="width: 250px;margin-bottom: 10px;" placeholder="请输入搜索的学校" allow-clear
          @search="onSearchGrade" />
        <!-- <a-tree
          style="min-width: 170px !important; height: calc(100vh - 250px)"
          :tree-data="nodeData"
          :autoExpandParent="true"
          :defaultExpandParent="true"
          defaultExpandAll
          :defaultExpandedKeys="[nodeData[0].id]"
          show-icon
          @select="onSelect"
          v-show="showSelect"
        >
          <template #title="{ orgname, id }">
            <a-dropdown :trigger="['contextmenu']">
              <span>{{ orgname }}</span>
              <template #overlay>
                <a-menu
                  @click="({ key: menuKey }) => onContextMenuClick(id, menuKey)"
                >
                </a-menu>
              </template>
            </a-dropdown>
          </template>
        </a-tree> -->
        <div style="height: calc(100vh - 260px); overflow-y: auto;">
          <p v-for="(item, index) in schoolData" :key="index" @click="getClass(item)" style="cursor: pointer"
            class="schoolName">
            {{ item.ORGNAME }}
          </p>
        </div>
      </a-col>
      <div>
        <a-modal v-model="setManagerVisible" :title="deptName" style="height: 300px" @cancel="closeModel">
          <div style="display: inline-block; height: 300px">
            <div style="height: 300px">
              <div :style="{ borderBottom: '1px solid #E9E9E9' }">
                <a-checkbox :indeterminate="indeterminate" v-model="checkAll" @change="onCheckAllChange">全选
                </a-checkbox>
              </div>
              <br />
              <a-checkbox-group v-model="checkedList" @change="onChange"
                style="width: 200px; height: 100%; overflow: auto">
                <div v-for="item in plainOptions" :key="item">
                  <a-checkbox :value="item.value" style="height: 50px !important"><img :src="item.imgUrl" alt="" srcset=""
                      style="border-radius: 5px" />&nbsp;&nbsp;{{ item.label }}
                  </a-checkbox>
                </div>
              </a-checkbox-group>
            </div>
          </div>

          <div style="
              width: 100%;
              height: 518px;
              display: inline-block;
              position: absolute;
            ">
            <div>已选择({{ tempList.length }}/9999)</div>
            <div class="dNlTZl" v-for="(item, index) in tempList" :key="index">
              <span>{{ item.displayName }}</span>
            </div>
          </div>

          <template slot="footer">
            <a-button @click="backOut"> 返回</a-button>
            <a-button key="submit" type="primary" :loading="loading" @click="setDeptZg">
              确定
            </a-button>
          </template>
        </a-modal>
      </div>
      <a-col :span="18" style="
          border-left: 4px solid #edeff2;
          min-height: calc(100vh - 198px);
          padding: 10px;
        ">
        <div style="margin-top: 10px">
          <div>
            <span style="
                color: #171a1d;
                font-weight: 600;
                font-size: 17px;
              ">{{ deptName }}</span>
            <div style="display: inline-block; position: absolute; right: 80px" class="set_font_set">
              <span style="
                  font-weight: 400;
                  white-space: nowrap;
                  text-align: center;
                  color: #0089ff;
                  margin-left: 20px;
                  cursor: pointer;
                ">
              </span>
            </div>
          </div>
          <div></div>
          <div style="margin-top: 15px" class="set_font_size">
            <a-button type="primary" @click="addClass" v-if="isAdmin">
              <a-icon type="user-add" />
              添加班级
            </a-button>
            <el-select v-model="selectGrade" placeholder="请选择" style="width: 250px;margin-left: 20px">
          <el-option v-for="(item, index) in classType" :key="index" :label="item.dictLabel" :value="item.dictCode + ''"
            size="small">
          </el-option>
        </el-select>
            <a-button type="primary" style="margin-left:20px;" @click="getByGrade">
              搜索
            </a-button>
          </div>
        </div>
        <a-table :pagination="false" style="margin-top: 15px" :columns="columns" :data-source="classInfo" bordered
          class="set_font_size" :rowKey="(record, index) => {
              return index;
            }
            ">
          <span slot="STATUS" slot-scope="STATUS">
            <span v-if="STATUS == 1">启用</span>
            <span v-else>禁用</span>
          </span>
          <span slot="cz" slot-scope="text, record">
            <a @click="getStudentByClass(record)" style="color:#ff4d4f">查看学生</a>
            <a style="margin-left: 20px;color:#ff4d4f" @click="getTeacherByClass(record)">查看教职工</a>
            <a style="margin-left: 20px;color:#ff4d4f" @click="editClass(record)" v-if="isAdmin">修改班级</a>
            <a style="margin-left: 20px;color:#ff4d4f" @click="delClass(record)" v-if="isAdmin">删除班级</a>
            <!-- <a-icon
              type="delete"
              class="deleteType"
              style="padding-left: 20px"
              @click.stop="showDeleteConfirm(record)"
            ></a-icon> -->
          </span>
          <span slot="type" slot-scope="type">
            <span v-if="type == 't001'">管理员</span>
            <span v-if="type == 't002'">教职工</span>
            <span v-if="type == 't003'">学生</span>
          </span>
          <span slot="action" slot-scope="text, record">
            <a-icon type="idcard" @click="getSchoolDetail(record)" />
            <a-icon type="edit" @click="editSchool(record)" style="margin-left: 20px" />
            <a-icon type="delete" style="margin-left: 20px" @click="showDeleteConfirm(record)" />
          </span>
        </a-table>

        <a-pagination style="margin: 10px 0" v-model="current" :page-size-options="pageSizeOptions" :total="total"
          show-size-changer :page-size="pageSize" @showSizeChange="onShowSizeChange" @change="pageChange">
          <template slot="buildOptionText" slot-scope="props">
            <span v-if="props.value !== '50'">{{ props.value }}条/页</span>
          </template>
        </a-pagination>
      </a-col>
    </a-row>
    <a-drawer :title="title" placement="right" :visible="teacherVisible" :headerStyle="{ 'padding-top': '20px' }"
      width="800px" @close="onTeacherClose">
      <div>
        <a-input placeholder="请输入教职工姓名" v-model="teacherName" style="width: 300px"></a-input>
        <a-button @click="getInputTeacherName" type="primary" icon="search" style="margin-left: 15px">
          搜索
        </a-button>
        <a-button @click="importTeacher" type="primary" style="margin-left: 15px">
          导入教师
        </a-button>
      </div>
      <a-table :columns="teacherColumns" :data-source="teacherInfo" style="margin-top: 20px" :pagination="false" :rowKey="(record, index) => {
          return index;
        }
        ">
        <span slot="cz" slot-scope="text, record">
          <a @click="removeTeacher(record)" style="color:#ff4d4f">移除教师</a>
        </span>
      </a-table>

      <a-pagination style="margin: 10px 0" v-model="studentCurrent" :page-size-options="studentPageSizeOptions"
        :total="teacherTotal" show-size-changer :page-size="studentPageSize" @showSizeChange="onShowSizeTeacher"
        @change="teacherPage">
        <template slot="buildOptionText" slot-scope="props">
          <span v-if="props.value !== '50'">{{ props.value }}条/页</span>
        </template>
      </a-pagination>
    </a-drawer>
    <a-drawer :title="title" placement="right" :closable="true" :visible="visible"
      :headerStyle="{ 'padding-top': '20px' }" width="495px" :after-visible-change="afterVisibleChange" zIndex="2"
      @close="onClose">

      <div>
        <a-modal v-model="modelVisible" title="部门列表" on-ok="handleOk" @cancel="noMoelSelect">
          <template slot="footer">
            <a-button key="back" @click="handleCancel"> 取消</a-button>
            <a-button key="submit" type="primary" :loading="loading" @click="handleOk">
              确定
            </a-button>
          </template>
          <a-tree style="min-width: 170px;!important;margin-top:10px;max-height: 400px; overflow-y: auto " ref="nodeTree"
            :tree-data="nodeData" :autoExpandParent="true" :defaultExpandParent="true" :selectedKeys="selectedKeys"
            :replace-fields="replaceFields" :defaultExpandedKeys="[nodeData[0].id]" show-icon @select="selectDept">
          </a-tree>
        </a-modal>
      </div>
      <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
        <el-form-item label="班级名称" prop="className">
          <el-input v-model="ruleForm.className"></el-input>
        </el-form-item>
        <el-form-item label="所在学校" prop="schoolCode">
          <el-input v-model="ruleForm.schoolName"></el-input>
          <div v-show="showSelect" style="max-height:300px;overflow-y:auto;">
            <p v-for="(item, index) in selectSchoolName" :key="index" @click="selectSchool(item)" style="cursor: pointer"
              class="schoolName">
              {{ item.ORGNAME }}
            </p>
          </div>
        </el-form-item>
        <el-form-item label="所在年级" prop="grade">
          <el-select v-model="ruleForm.grade" placeholder="请选择" style="width: 100%;">
            <el-option v-for="(item, index) in classType" :key="index" :label="item.dictLabel"
              :value="item.dictCode + ''">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="班主任名称" prop="mainTeacherId">
          <el-select
              v-model="ruleForm.mainTeacherId"
              filterable
              placeholder="请选择"
              style="width: 100%"
          >
            <el-option
                v-for="item in teacherListSelect"
                :key="item.value"
                :label="item.teacher_name+'('+item.subjectName+')'"
                :value="item.teacher_id"
            >
            </el-option>
          </el-select>

        </el-form-item>
        <el-form-item label="状态" prop="enable">
          <el-select v-model="ruleForm.enable" placeholder="请选择" style="width: 100%;">
            <el-option label="禁用" :value="0"></el-option>
            <el-option label="启用" :value="1"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="submitForm('ruleForm')">{{ btnTitle }}
          </el-button>
          <el-button @click="resetForm('ruleForm')">重置</el-button>
        </el-form-item>
      </el-form>
    </a-drawer>

    <a-drawer title="学生列表" placement="right" :closable="true" :visible="studentVisible"
      :headerStyle="{ 'padding-top': '20px' }" width="800px" :after-visible-change="afterVisibleChange" zIndex="2"
      @close="onStudentClose">
      <div>
        <a-input placeholder="请输入学生姓名" v-model="studentName" style="width: 350px"></a-input>
        <!--        searchTeacher-->
        <a-button @click="seachStudent" type="primary" icon="search" style="margin-left: 15px">
          搜索
        </a-button>
        <a-button @click="importStudent" type="primary" style="margin-left: 15px">
          导入学生
        </a-button>

      </div>
      <a-table :columns="studentColumns" :data-source="studentInfo" style="margin-top: 20px" :pagination="false" :rowKey="(record, index) => {
          return index;
        }
        ">
        <span slot="cz" slot-scope="text, record">
          <a @click="moveStudentClass(record)" style="color:#ff4d4f">移除学生</a>

        </span>
      </a-table>
      <a-pagination style="margin: 10px 0" v-model="studentCurrent" :page-size-options="studentPageSizeOptions"
        :total="studentTotal" show-size-changer :page-size="studentPageSize" @showSizeChange="onShowSizeStudentChange"
        @change="studentChange">
        <template slot="buildOptionText" slot-scope="props">
          <span v-if="props.value !== '50'">{{ props.value }}条/页</span>
        </template>
      </a-pagination>
    </a-drawer>
  </div>
</template>

<script>
const teacherColumns = [
  {
    title: "教职工姓名",
    dataIndex: "teacher_name",
  },
  {
    title: "状态",
    dataIndex: "conditionName",
  },
  {
    title: "所教课程",
    dataIndex: "subjectName",
  }, {
    title: "操作",
    dataIndex: "cz",
    scopedSlots: { customRender: "cz" },
  },

];
const studentColumns = [
  {
    title: "学生姓名",
    dataIndex: "student_name",
  },
  {
    title: "学生类型",
    dataIndex: "studentTypeName",
  },
  {
    title: "年级",
    dataIndex: "gradeName",
  },
  {
    title: "状态",
    dataIndex: "newStatusName",
  },
  {
    title: "操作",
    dataIndex: "cz",
    scopedSlots: { customRender: "cz" },
  }
];
const columns = [
  {
    title: "所在学校",
    dataIndex: "schoolName",
    scopedSlots: { customRender: "age" },
  },
  {
    title: "所在年级",
    dataIndex: "gradeName",
  },
  {
    title: "班级",
    dataIndex: "className",
  },
  {
    title: "学校编码",
    dataIndex: "schoolCode",
  },
  {
    title: "班主任名称",
    dataIndex: "teacherName",
  },
  {
    title: "操作",
    dataIndex: "cz",
    scopedSlots: { customRender: "cz" },
  },
];

const data = [];
for (let i = 0; i < 100; i++) {
  data.push({
    key: i.toString(),
    name: `Edrward ${i}`,
    age: 32,
    address: `London Park no. ${i}`,
  });
}

// 数组对象中查找符合目标的对象
const parseArray = function (objArray, key, value) {
  for (let i in objArray) {
    let element = objArray[i];
    if (typeof element === "object") {
      let result = parseArray(element, key, value);
      if (result) return result;
    } else {
      if (i === key) {
        if (element === value) return objArray;
      }
    }
  }
};

import contacts from "@/api/organizations";
import student from "@/api/studentList";
import teacher from "@/api/teacherManage";


export default {
  name: "index1",
  data() {
    this.cacheData = data.map((item) => ({ ...item }));
    return {
      classType: [],
      teacherData: {
        page: 1,
        teacherName: "",
        size: 10,
        total: 0
      },
      studentData: {
        page: 1,
        grade: "",
        studentName: "",
        size: 10,
        total: 0
      },teacherBySchool: {
        grade: "",
        studentName: "",
      },
      teacherClass: {
        teacherIds: [],
        classId: "",
      },
      studentClass: {
        studentIds: [],
        classId: "",
      },
      teacherListInfo: [],
      btnTitle: "立即创建",
      studentColumns,
      studentName: "",
      teacherVisible: false,
      studentVisible: false,
      studentListInfo: [],
      teacherColumns,
      className: "",
      teacherName: "",
      ruleForm: {
        schoolCode: "",
        className: "",
        mainTeacherId: "",
        grade: "",
        enable: "",
        schoolName: '',
        classId:'',
      },
      rules: {
        schoolCode: [
          { required: true, message: "请输入学校名称", trigger: "blur" },
          {
            min: 3,
            max: 100,
            message: "长度必须大于三个字符",
            trigger: "blur",
          },
        ],
        schoolName: [
          { required: true, message: "请输入学校名称", trigger: "blur" },
          {
            min: 3,
            max: 100,
            message: "长度必须大于三个字符",
            trigger: "blur",
          },
        ],
        className: [
          { required: true, message: "请输入班级名称", trigger: "change" },
        ],
        grade: [
          { required: true, message: "请输入所在年级", trigger: "change" },
        ],
        teacherName: [
          { required: true, message: "请输入班主任姓名", trigger: "change" },
        ],
      },
      total: 0,
      current: 1,
      pageSizeOptions: ["10", "20", "30", "40", "50"],
      pageSize: 10,
      pageNo: 1,
      keyWord: "",
      //color:#171a1d;font-size:14px;padding-left: 20px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
      fontSize: {
        "font-size": "14px",
      },
      fontColor: {
        color: "#171a1d",
      },
      paddingLeft: {
        "padding-left": "20px",
      },
      whiteSpace: {
        "white-space": "nowrap",
      },
      overflowStyle: {
        overflow: "hidden",
      },
      backgroundColor: {},
      textOverflow: {
        "text-overflow": "ellipsis",
      },
      checkedList: [],
      selectUserList: [],
      timer: null,
      selectDeptList: [],
      showSelect: true,
      defaultCheckList: [],
      indeterminate: true,
      checkAll: false,
      plainOptions: [
        { label: "Apple", value: "Apple" },
        { label: "Pear", value: "Pear" },
        { label: "Orange", value: "Orange" },
      ],
      checkedSelected: [],
      setManagerVisible: false,
      modelSelectValue: { name: "", id: "" },
      data,
      columns,
      editingKey: "",
      deptName: "",
      userInfo: [],
      schoolData: [],
      title: "",
      visible: false,
      deptId: "",
      //判断是增加还是修改
      addOrUpdate: 0,
      modelVisible: false,
      replaceFields: {
        title: "orgname",
        key: "id",
        child: "children",
      },
      nodeData: [{}],
      codeLine: "",
      selectedKeys: null,
      filterResource: null,
      selectSchoolName: [],
      tempList: [],
      classInfo: [],
      teacherListSelect:[],
      getById: "",
      classId: "",
      studentTotal: 0,
      studentCurrent: 1,
      studentPageSizeOptions: ["10", "20", "30", "40", "50"],
      studentPageSize: 10,
      studentPageNo: 1,
      schoolId: "",
      importStudentVisible: false,
      importTeacherVisible: false,
      studentInfo: [],
      teacherInfo: [],
      studentByClass:{
        size:10,
        page:1
      },
      teacherByClass:{
        size:10,
        page:1
      },
      teacherTotal: 0,
      studentSelectedRowKeys: [],
      teacherSelectedRowKeys: [],
      selectGrade:"",
      isAdmin:false
    };
  },
  async created() {
    // 树的获取
    let res = await contacts.getNodeData(); // 获取树节点信息的函数
    this.deptName = res.data.orgname;
    let arr = res.data;
    this.nodeData = arr;
  },
  mounted() {
    this.getSchoolByUser();
    this.getClassType()
    this.getRole()

  },
  watch: {
    "ruleForm.schoolName"() {
      if (this.ruleForm.schoolName != "" && this.ruleForm.schoolName != null) {
        this.fd(this.ruleForm.schoolName, 500);
        this.showSelect = true;
      } else {
        this.showSelect = false;
      }
    },
    checkedList: {
      handler(val) {
        this.indeterminate =
          !!val.length && val.length < this.plainOptions.length;
        this.checkAll =
          val.length > 0 && val.length === this.plainOptions.length;
      },
    },
  },

  methods: {
    getRole() {
      contacts.getRoleByUser().then((res) => {
        // this.roleId = res.data.data.deptCodeRole[0].code;
        for (let i = 0; i < res.data.data.deptCodeRole.length; i++) {
          if (res.data.data.deptCodeRole[i].code == "t001") {
            this.isAdmin = true;
          }
        }
      });
    },

    importStudentData() {
      this.importStudentVisible = false;
      student.saveStudentClass(this.studentClass).then(res => {
        if (res.data.code == 200) {
          this.$message.success("导入成功")
          this.getStudentInfo()
        }
      }, err => {
        console.log(err);
      })
    },
    importTeacherData() {
      this.importTeacherVisible = false
      teacher.saveTeacherClass(this.teacherClass).then(res => {
        if (res.data.data) {
          this.$message.success("导入成功")
          this.getTeacherInfoByClass()
        }

      }, err => {
        console.log(err);
      })
    },
    //移除学生
    moveStudentClass(val) {

      let dataStudent = {
        classId: this.classId,
        studentIds: []
      }
      dataStudent.studentIds.push(val.student_id)
      this.$confirm("此操作将永久删除该数据, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        student.moveStudentClass(dataStudent).then(res => {
          if (res.data.code == 200) { this.$message.success("移除成功"); this.getStudentInfo() }

        }, err => {
          this.$message.error("接口异常" + err);
        });
      }).catch(() => { })

    },
    //搜索教师
    searchTeacher() {
      this.importTeacher()
    },
    getInputTeacherName() {
      this.getTeacherInfoByClass();
    },
    searchStudent() {
      this.importStudent();
    },
    //教师复选框
    onTeacherSelectChange(selectedRowKeys, arr) {

      this.teacherClass.teacherIds = arr.map(res => {
        return res.teacher_id
      })
      this.teacherClass.classId = this.classId
      this.teacherSelectedRowKeys = selectedRowKeys;
    },
    onStudentSelectChange(selectedRowKeys, arr) {
      this.studentSelectedRowKeys = selectedRowKeys

      this.studentClass.classId = this.classId

      this.studentClass.studentIds = arr.map(res => {
        return res.student_id;
      })
    },
    //教师导入班级
    importTeacher() {
      this.teacherSelectedRowKeys = []
      //todo 已有赋值
      this.teacherData.schoolCode = this.schoolId;
      teacher.getTeacher(this.teacherData).then(res => {
        this.teacherListInfo = res.data.data.data;
        this.teacherData.total = res.data.data.total;
      }, err => {
        console.log(err)
      })
      this.importTeacherVisible = true;

    },
    selectAllTeacherBySchool(){
      this.teacherBySchool.schoolCode = this.schoolId;
      teacher.selectAllTeacherBySchool(this.teacherBySchool).then( res =>{
        this.teacherListSelect = res.data.data.data;
      })
    },
    //学生导入班级
    importStudent() {
      this.studentSelectedRowKeys = []
      this.studentData.schoolCode = this.schoolId;
      this.studentData.newStatus=170;
      student.selectAllStudent(this.studentData).then(res => {
        this.studentListInfo = res.data.data.students;
        this.studentData.total = res.data.data.total;
      }, err => {
        console.log(err)
      })
      this.importStudentVisible = true;
      this.getStudentInfo()
    },
    editClass(val) {
      this.addOrUpdate=1;
      this.getClassType();
      this.ruleForm.classId = val.classId
      this.ruleForm.className = val.className
      this.ruleForm.grade = val.grade
      this.ruleForm.schoolCode = val.schoolCode
      this.ruleForm.enable = val.enable
      this.ruleForm.schoolName = val.schoolName
      this.ruleForm.mainTeacherId= val.mainTeacherId
      this.title = "修改班级"
      this.btnTitle = "修改",




        this.showDrawer();
    },
    getClass(val) {

      this.getById = val.ORGCODE;
      this.deptName = val.ORGNAME;
      this.schoolId= this.getById;

      this.selectAllTeacherBySchool()
      let data = {
        schoolCode: this.getById,
        page: this.current,
        size: this.pageSize,
      };
      // this.getClassInfo(data);
      this.getClassBySchool(data);
    },
    getSchoolByUser() {
      contacts.getSchoolList().then((res) => {
        this.schoolData = res.data.data.schools;
      });
    },
    onSearchGrade(val) {
      contacts.getSchoolList({ schoolName: val }).then((res) => {
        this.schoolData = res.data.data.schools;
      });
    },
    delClass(val) {
      this.$confirm("此操作将永久删除该数据, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          contacts.delClass(val.classId).then((res) => {
            if (res.data.code == 200) {
              this.$message({
                type: "success",
                message: "删除成功!",
              });
              let data = {
                schoolCode: this.getById,
                page: this.current,
                size: this.pageSize,
              };
              // this.getClassInfo(data);
              this.getClassBySchool(data);
            } else {
              this.$message({
                type: "error",
                message: "删除失败",
              });
            }
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除",
          });
        });
    },
    removeTeacher(val) {
      this.$confirm("此操作将永久删除该数据, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {

        let teacherSubmitData = {
          teacherIds: [],
          classId: this.classId
        }
        teacherSubmitData.teacherIds.push(val.teacher_id)

        teacher.delTeacherByClss(teacherSubmitData).then(res => {


          if (res.data.code == 200) { this.$message.success("移除成功"); this.getTeacherInfoByClass() }

        }, err => {
          this.$message.error("接口异常" + err);
        });
        // let arr = []
        // arr.push(val.teacher_id)
        // let data ={
        //   classId:val.class_id,
        //   teacherIds:arr
        // }
        // contacts.delTeacherByClss(data).then((res) => {
        //   if (res.data.code == 200) {
        //     this.$message({
        //       type: "success",
        //       message: "删除成功!",
        //     });
        //     let data = {
        //       schoolCode: this.getById,
        //       page: this.current,
        //       size: this.pageSize,
        //     };
        //     // this.getClassInfo(data);
        //     this.getTeacherByClass(data);
        //   } else {
        //     this.$message({
        //       type: "error",
        //       message: "删除失败",
        //     });
        //   }
        // });
      })
        .catch(() => {
          //   this.$message({
          //     type: "info",
          //     message: "已取消删除",
          //   });
        });
    },
    getStudentByClass(val) {
      this.classId = val.classId;
      this.schoolId = val.schoolCode;
      this.studentVisible = true;
      this.getStudentInfo();
    },
    getStudentInfo() {
      let data = {
        classId: this.classId,
        studentName: this.studentName,
        page: this.studentCurrent,
        size: this.studentPageSize,
      };
      student.getStudentByClass(data).then((res) => {
        if (res.data.code == 200) {
          this.studentInfo = res.data.data.data;
          this.studentTotal = res.data.data.total;
        }
      });
      this.studentVisible = true;
    },

    teacherPage(val){
      this.teacherByClass.page=val;
      this.getTeacherInfoByClass()
    },
    onShowSizeTeacher(current, pageSize){
      this.teacherByClass.page=current;
      this.teacherByClass.size=pageSize
      this.getTeacherInfoByClass()
    },
    onShowSizeStudentChange(current, pageSize) {
      this.studentPageSize = pageSize;
      this.getStudentInfo();
    },
    studentChange(val) {
      this.studentCurrent = val;
      this.getStudentInfo();
    },
    // getTeacherInfo() {
    //   let data = {
    //     classId: this.classId,
    //     name: this.teacherName,
    //     page: this.studentCurrent,
    //     size: this.studentPageSize,
    //   };
    //   contacts.getTeacherByClass(data).then((res) => {
    //     this.teacherInfo = res.data.data;
    //     this.teacherTotal = res.data.data.total;
    //   });
    // },
    onTeacherClose() {
      this.teacherVisible = false;
      this.studentCurrent = 1;
      this.studentPageSize = 10;
    },
    seachStudent() {
      this.getStudentInfo();
    },
    seachTeacher() {
      this.getTeacherInfo();
    },
    onStudentClose() {
      (this.studentCurrent = 1),
        (this.studentPageSize = 10),
        (this.studentVisible = false);
    },
    getStudentByClas(val) {
      this.studentVisible = true;
      this.title = "学生列表";
      this.class = val.class_id;
      this.getStudentInfo();
    },
    getTeacherByClass(val) {
      this.title = "教职工列表";
      this.teacherVisible = true;
      this.classId = val.classId
      this.schoolId = val.schoolCode
      this.getTeacherInfoByClass();
    },
    getTeacherInfoByClass() {
      let data = {
        classId: this.classId,
        page: this.teacherByClass.page,
        size: this.teacherByClass.size,
        teacherName: this.teacherName
      }
      teacher.getTeacherByClass(data).then((res) => {
        this.teacherInfo = res.data.data.data;
        this.teacherTotal = res.data.data.total;
      })
    },
    submitForm(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          if(this.addOrUpdate==0){
            contacts.addClass(this.ruleForm).then((res) => {
            if (res.data.code == 200) {
              this.$message.success("添加成功");
              this.visible = false;
              let data = {
                schoolCode: this.getById,
                page: this.current,
                size: this.pageSize,
              };
              // this.getClassInfo(data);
              this.getClassBySchool(data);
            } else {
              this.$message.error("添加失败");
              this.visible = false;
            }
          });
          }else{
            contacts.updateClass(this.ruleForm).then((res)=>{
              if (res.data.code == 200) {
              this.$message.success("修改成功");
              this.visible = false;
              let data = {
                schoolCode: this.getById,
                page: this.current,
                size: this.pageSize,
              };
              this.getClassBySchool(data);
            } else {
              this.$message.error("修改失败");
              this.visible = false;
            }
            })
          }
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },

    resetForm(formName) {
      this.$refs[formName].resetFields();
    },
    getBySelectId(value) {
      this.deptName = value.orgName;
      this.getChirld(value.id);
    },
    getBySelectUser(obj) {
      this.addOrUpdate = 1;
      this.form.nickName = obj.displayName;
      this.form.department = obj.ORGNAME;
      this.form.departmentId = obj.orgId;
      this.form.mobile = obj.MOBILE;
      this.form.userName = obj.USERNAME;
      this.form.emial = obj.EMAIL;
      this.form.passWord = "";
      this.form.id = obj.userId;
      this.visible = true;
    },
    onShowStudentSizeChange(current, pageSize) {
      this.studentData.page = current
      this.studentData.size = pageSize
      this.importStudent();
    },
    studentPageChange(val) {
      this.studentData.page = val
      this.importStudent();
    },
    onShowTeacherSizeChange(current, pageSize) {
      this.teacherData.page = current
      this.teacherData.size = pageSize
      this.importTeacher();
    },
    teacherPageChange(val) {
      this.teacherData.page = val
      this.importTeacher();
    },
    onShowSizeChange(current, pageSize) {
      this.current=current
      this.pageSize=pageSize
      let data = {
        schoolCode: this.getById,
        page: this.current,
        size: this.pageSize,
      };
      // this.getClassInfo(data);
      this.getClassBySchool(data);
    },
    pageChange(val) {
      this.current = val;
      let data = {
        schoolCode: this.getById,
        page: this.current,
        size: this.pageSize,
      };
      // this.getClassInfo(data);
      this.getClassBySchool(data);
    },
    mouseOver() {
      this.backgroundColor = "background-color:black";
    },
    selectSchool(val) {
      this.showSelect = false;
      this.ruleForm.schoolName = val.ORGNAME;
      this.ruleForm.schoolCode = val.ORGCODE;
    },
    /*输入框防抖 */
    fd(fn, delay) {
      if (this.timer) clearTimeout(this.timer);
      this.timer = setTimeout(() => {
        let data = {
          schoolName: fn,
        };
        contacts.getSchoolList(data).then((res) => {
          this.selectSchoolName = res.data.data.schools;
        });
      }, delay);
    },
    onContextMenuClick(treeKey, menuKey) {
    },
    showDeleteConfirm(obj) {
      var that = this;
      this.$confirm({
        title: "您确定要删除这条数据吗",
        content: "此操作可能有风险",
        okText: "确定",
        okType: "danger",
        cancelText: "否",
        onOk() {
          let orgId = obj.id;
          contacts.delUser(orgId).then((res) => {
            if (res.data == "删除成功") {
              that.$message.success("删除成功");
              that.getChirld(that.getById);
            }
          });
        },
        onCancel() {
        },
      });
    },
    // editUser(obj) {
    //   this.addOrUpdate = 1;
    //   this.form.nickName = obj.displayName;
    //   this.form.department = obj.orgname;
    //   this.form.departmentId = obj.orgId;
    //   this.form.mobile = obj.MOBILE;
    //   this.form.userName = obj.USERNAME;
    //   this.form.emial = obj.EMAIL;
    //   this.form.passWord = "";
    //   this.form.id = obj.id;
    //   this.visible = true;
    // },
    closeModel() {
      (this.checkedList = []), (this.checkedSelected = []);
    },
    setManager() {
      if (this.getById == "" && this.getById == null) {
        this.$message.error("请选择部门");
      } else if (this.userInfo.length <= 0) {
        this.$message.error("当前部门暂无工作人员");
      } else {
        this.plainOptions = [];
        for (let i = 0; i < this.userInfo.length; i++) {
          this.plainOptions.push({
            label: this.userInfo[i].displayName,
            value: this.userInfo[i].id,
            imgUrl: this.drawLogo(this.userInfo[i].displayName, "微软雅黑"),
          });
        }
        this.checkedList = [];
        this.tempList = [];
        contacts.getZgByOrgId(this.getById).then((res) => {
          for (let index = 0; index < res.data.length; index++) {
            this.checkedList.push(res.data[index].id);
            this.tempList.push({
              displayName: res.data[index].displayName,
              id: res.data[index].id,
            });
          }
        });
        this.setManagerVisible = true;
      }
    },
    backOut() {
      this.setManagerVisible = false;
    },
    onChange() {
      this.tempList = [];

      for (let index = 0; index < this.checkedList.length; index++) {
        let obj = {
          id: this.checkedList[index],
          displayName: this.getOnlyObj(this.checkedList[index]).label,
        };

        this.tempList.push(obj);
      }
    },
    getOnlyObj(id) {
      var obj = this.plainOptions.find(function (obj) {
        return obj.value == id;
      });
      return obj;
    },
    unique(arr) {
      return Array.from(new Set(arr));
    },
    onCheckAllChange(e) {
      this.tempList = [];
      if (e.target.checked) {
        for (let index = 0; index < this.plainOptions.length; index++) {
          let obj = {
            id: this.plainOptions[index].value,
            displayName: this.plainOptions[index].label,
          };
          this.tempList.push(obj);
        }
      }
      this.checkedList = e.target.checked
        ? this.plainOptions.map((item) => item.value)
        : [];
      this.indeterminate = false;
    },
    canclModel(e) {
      this.modelSelectValue = null;
    },
    drawLogo: function (text, font) {
      // 创建画布
      let canvas = document.createElement("canvas"); // 绘制文字环境
      let context = canvas.getContext("2d"); // 设置字体
      context.font = font; // 获取字体宽度
      let width = context.measureText(text).width; // 如果宽度不够 240
      if (width < 240) {
        width = 60;
      } else {
        width = width + 30;
      } // 画布宽度
      canvas.width = 40; // 画布高度
      canvas.height = 40; // 填充白色
      context.fillStyle = "#13c2c2"; // 绘制文字之前填充白色
      context.fillRect(0, 0, canvas.width, canvas.height); // 设置字体
      context.font = "14px " + font; // 设置水平对齐方式
      context.textAlign = "center"; // 设置垂直对齐方式
      context.textBaseline = "middle"; // 设置字体颜色
      context.fillStyle = "#fff"; // 绘制文字(参数：要写的字，x坐标，y坐标)

      context.fillText(text, canvas.width / 2, canvas.height / 2); // 生成图片信息
      let dataUrl = canvas.toDataURL("image/png");
      // this.imgSrc = dataUrl;

      return dataUrl;
    },
    handleCancel(e) {
      this.form.department = "";
      this.form.departmentId = "";
      this.modelVisible = false;
    },
    setDeptZg() {
      if (this.checkedList <= 0) {
        this.$message.error("最少选择一个人");
      }
      let data = {
        userIds: this.checkedList,
        orgId: this.getById,
      };
      contacts.setDeptZg(data).then((res) => {
        if (res.data == "添加成功") {
          this.$message.success("添加成功");
          this.setManagerVisible = false;
        }
      });
    },
    showModal() {
      this.modelVisible = true;
    },
    handleOk() {
      this.modelVisible = false;
    },
    showDrawer() {
      this.visible = true;
    },
    onClose() {
      this.addOrUpdate = 0;
      this.ruleForm.className = '',
        this.ruleForm.schoolName = '',
        this.ruleForm.grade = '',
        this.ruleForm.teacherName = '',
        this.resetForm("ruleForm"), (this.visible = false);
    },
    noMoelSelect() {
      this.form.department = "";
      this.form.departmentId = "";
    },
    // onSubmit() {
    //   this.$refs.ruleForm.validate((valid) => {
    //     if (valid) {
    //       let userInfoDTO = {
    //         userName: this.form.userName,
    //         password: this.form.passWord,
    //         orgId: this.form.departmentId,
    //         mobile: this.form.mobile,
    //         nickName: this.form.nickName,
    //         email: this.form.emial,
    //         orgName: this.form.department,
    //         id: "",
    //       };
    //       if (this.addOrUpdate == 0) {
    //         contacts.addUserByOrg(userInfoDTO).then((res) => {
    //           if (res.data == "添加成功") {
    //             this.$message.success("添加成功");
    //             this.getChirld(this.getById);
    //             this.onClose();
    //           }
    //         });
    //       } else {
    //         userInfoDTO.id = this.form.id;
    //         contacts.updateUser(userInfoDTO).then((res) => {
    //           if (res.data == "修改成功") {
    //             this.$message.success("修改成功");
    //             this.getChirld(this.getById);
    //             this.onClose();
    //           }
    //         });
    //       }
    //     } else {
    //       return false;
    //     }
    //   });
    // },
    // resetForm() {
    //   (this.form = {
    //     nickName: "",
    //     departmentId: "",
    //     department: "",
    //     mobile: "",
    //     userName: "",
    //     passWord: "",
    //     emial: "",
    //   }),
    //     this.$refs.ruleForm.resetFields();
    // },
    addClass() {
      this.btnTitle = "立即创建",
        this.title = "添加班级";
        this.addOrUpdate=0;
      this.ruleForm.className = '',
        this.ruleForm.schoolName = '',
        this.ruleForm.grade = '',
        this.ruleForm.teacherName = '',
        this.showDrawer();
      this.getClassType();
    },
    // 获取全部节点树
    async GetLimsConfigNode() {
      // this.nodeData = await GetLimsConfigNodeData();
    },
    //获取年级类型
    async getClassType() {
      await contacts.getClassType().then((res) => {
        this.classType = res.data.data.dictionaries;
      });
    },
    getAllDept() {
      contacts.getOrganizations().then(() => {
      });
    },
    handleChange(value, key, column) {
      const newData = [...this.data];
      const target = newData.find((item) => key === item.key);
      if (target) {
        target[column] = value;
        this.data = newData;
      }
    },
    edit(key) {
      const newData = [...this.data];
      const target = newData.find((item) => key === item.key);
      this.editingKey = key;
      if (target) {
        target.editable = true;
        this.data = newData;
      }
    },
    save(key) {
      const newData = [...this.data];
      const newCacheData = [...this.cacheData];
      const target = newData.find((item) => key === item.key);
      const targetCache = newCacheData.find((item) => key === item.key);
      if (target && targetCache) {
        delete target.editable;
        this.data = newData;
        Object.assign(targetCache, target);
        this.cacheData = newCacheData;
      }
      this.editingKey = "";
    },
    cancel(key) {
      const newData = [...this.data];
      const target = newData.find((item) => key === item.key);
      this.editingKey = "";
      if (target) {
        Object.assign(
          target,
          this.cacheData.find((item) => key === item.key)
        );
        delete target.editable;
        this.data = newData;
      }
    },
    selectDept(params, e) {
      this.form.department = e.node._props.title;
      this.form.departmentId = params[0];
    },
    getChirld(params) {
      contacts.getUserList(params).then((res) => {
        this.userInfo = res.data;
      });
    },
    // getClassInfo(data) {
    //   school.getClassBySchool(data).then((res) => {
    //     this.classInfo = res.data.rows;
    //     this.total = res.data.total;
    //   });
    // },
    getClassBySchool(data) {
      contacts.getClassInfoBySchool(data).then((res) => {
        this.classInfo = res.data.data.data;
        this.total = res.data.data.total;
      });
    },
    async onSelect(params, e) {
      let arr = {};

      this.deptName = e.selectedNodes[0].data.props.orgname;
      this.getById = e.selectedNodes[0].data.props.id;
      if (
        e.selectedNodes[0].data.props.id != null &&
        e.selectedNodes[0].data.props.id != ""
      ) {
        arr.school_code = e.selectedNodes[0].data.props.id;
        arr.class_name = this.className;
        arr.teacher_name = this.teacherName;
        arr.grade = this.grade;

        // let str = "{";
        // for (let k in arr) {
        //   if (arr[k] != "") {
        //     str += k + ":" + arr[k] + ",";
        //   }
        // }
        // str = str.substring(0, str.length - 1);
        // str = str + "}";
        // let data = {
        //   filters: str,
        //   pageNo: this.current,
        //   pageSize: this.pageSize,
        // };
        let data = {
          schoolCode: this.getById,
          page: this.current,
          size: this.pageSize,
          grade:this.selectGrade
        };
        // this.getClassInfo(data);
        this.getClassBySchool(data);
      }

      //   var str = "{"
      //   if(e.selectedNodes[0].data.props.id!=null && e.selectedNodes[0].data.props.id!=''){
      //         str+="school_code:"+e.selectedNodes[0].data.props.id
      //         if(this.className!=null || this.teacher_name !==''){

      //         }
      //   }
      //   if(this.className!=null && this.className !=''){
      //     str+="class_name:"
      //   }

      //   str+="}"
    },
    getByGrade(){
      let data = {
          schoolCode: this.getById,
          page: this.current,
          size: this.pageSize,
          grade:this.selectGrade
        };
        // this.getClassInfo(data);
        this.getClassBySchool(data);
    }
  },
};
</script>

<style lang="less" scoped>
.schoolName:hover {
  background-color: rgb(246, 224, 224);
}

.wrap {
  position: relative;
}

.orgName:hover {
  background-color: #7e868e29;
  cursor: pointer;
}

.set_button_margin_left {
  margin-left: 15px;
}

.set_font_size {
  font-size: 14px;
}
</style>

<style lang="less">
// .ant-checkbox-group-item {
//   display: block;
// }

.ant-drawer-title {
  margin: 0;
  color: rgba(0, 0, 0, 0.85);
  font-weight: 500;
  font-size: 14px;
  line-height: 22px;
}

.set_drawer_div {
  margin-top: -15px;
  width: 490px;
  height: 48px;
  font-weight: 500;
  color: #171a1d;
  font-size: 14px;
}
</style>
